<template>
  <div>
    <section class="ui-container">
      <div class="ui-form">
        <div class="ui-form-item ui-form-item-show ui-border-b">
          <label><span class="label_span">*</span>姓名</label>
          <input type="text" placeholder="请输入姓名" readonly v-model="tableinfo.username1" maxlength="20"/>
        </div>
        <div class="ui-form-item ui-form-item-show ui-border-b">
          <label><span class="label_span">*</span>手机号码</label>
          <input type="text" placeholder="请输入手机号码" readonly v-model="tableinfo.userphone" maxlength="11"/>
        </div>
        <div class="ui-form-item ui-form-item-show ui-border-b">
          <label><span class="label_span">*</span>身份证号</label>
          <input type="text" placeholder="请输入身份证号" readonly v-model="tableinfo.usercode"/>
        </div>
        <div class="ui-form-item ui-border-b" style="padding-bottom: 6px;">
          <label style="line-height: 22px;">
            <span class="label_span">*</span>是否为当前<br/>时间及地点
          </label>
          <label class="ui-radio" style="float: left;margin: 8px 0 0 92px;">
            <input type="radio" name="istimeaddr" class="ui-radio-input1" id="istimeaddr1" @click="istimeaddr1"
                   checked/>是
            <input type="radio" name="istimeaddr" class="ui-radio-input2" id="istimeaddr2" @click="istimeaddr2"
                   style="margin-left: 10px;"/>否
          </label>
        </div>
        <div class="ui-form-item ui-form-item-show ui-border-b" style="overflow-x: hidden;">
          <label v-if="ISSFtime2"><span class="label_span">*</span>事发时间</label>
          <datetime v-if="ISSFtime2"  style="position: relative; top: -2px;" v-model="tableinfo.datenownew" format="YYYY-MM-DD HH:mm"   :title="事发时间"></datetime>
          <label v-if="ISSFtime1"><span class="label_span">*</span>事发时间</label>
          <input type="text" id="appDateTime" v-if="ISSFtime1" readonly v-model="tableinfo.datenownew" placeholder="请输入事发时间"/>
        </div>

        <div id="tureIStime">
          <selector title="州市" :options="list1" v-model="list1Value" class="star" @on-change="onChangeZsqh"></selector>
          <selector title="区县" :options="list2" v-model="list2Value" class="star"></selector>
          <div class="ui-form-item ui-form-item-show ui-border-b" style="height: 75px;">
            <textarea style="padding-left: 0; height: 75px;" placeholder="请输入事发地点" id="dz_inpt"
                      v-model="tableinfo.inptaddr"></textarea>
          </div>
        </div>
        <div id="falseIStime">
          <div class="ui-form-item ui-form-item-textarea ui-border-b" style="height: 100px;position: relative;">
            <label>
              <span class="label_span">*</span>事发地点
            </label>
            <textarea placeholder="请输入事发地点" readonly style="height: 75px;" :maxlength="bjmaxlength"
                      id="dz_inpt1" v-model="tableinfo.inpt1addr"></textarea>
          </div>
        </div>
        <div class="ui-form-item ui-border-b" style="padding-bottom: 6px;">
          <label style="line-height: 22px;"><span class="label_span">*</span>是否方便<br/>接听来电</label>
          <label class="ui-radio" style="float: left;margin: 8px 0 0 92px;">
            <input type="radio" name="isphone" id="isphone1" checked="checked" @click="isphoneclick1"/>是
            <input type="radio" name="isphone"  style="margin-left: 10px;" id="isphone2"
                   @click="isphoneclick0"/>否
          </label>
        </div>
        <div class="ui-form-item ui-form-item-textarea ui-border-b" style="height: 100px;position: relative;">
          <label>
            <span class="label_span">*</span>报警内容
          </label>
          <textarea placeholder="请输入报警内容" style="height: 75px;" :maxlength="bjmaxlength" id="crcontentid"
                    v-model="tableinfo.crcontent"></textarea>
        </div>

        <ul class="ul_lost">
          <li>
            <h1 class="h1_text" style="color: #666; font-size: 16px;margin: 0px 10px; ">
              报警资料上传<span class="red">（选填）</span></h1>
          </li>
        </ul>
        <div style="width: 100%;float: left;margin-bottom: 20px;">
          <div class="weui_cells weui_cells_form" style="margin-top: 0px;">
            <div class="weui_cell">
              <div class="weui_cell_bd weui_cell_primary">
                <div class="weui_uploader">
                  <div class="weui_uploader_hd weui_cell">
                    <div class="weui_cell_bd weui_cell_primary">图片上传<span class="red">（单张图片不能大于5M）</span></div>
                    <div class="weui_cell_ft"></div>
                  </div>
                  <div class="weui_uploader_bd" style="margin-top: 10px;">
                    <group class="baby-group" name="grouppic">
                      <div v-for="(item, index) in upfilespic" style="width: 100%;">
                        <div class="yn-update-demo">
                          <div class="yn-update-demo-img"><img
                            src="http://shp.qpic.cn/weixinsrc_pic/pScBR7sbqjOBJomcuvVJ6iacVrbMJaoJZkFUIq4nzQZUIqzTKziam7ibg/"/>
                          </div>
                          <div class="yn-update-demo-mask">
                            <img src="../../assets/amplification.png"/>
                          </div>
                        </div>
                        <el-upload
                          :action="posturl+'?guid='+item.fileGuid+'&idx='+index"
                          list-type="picture-card"
                          :on-success="handleSucess"
                          :on-preview="handlePictureCardPreview"
                          :before-upload="beforeUpload"
                          :on-remove="onRemove"
                          :on-change="changeFile"
                          :file-list="filelist.picfileList[0]"
                          accept="image/*"
                          class="yn-update">
                          <i class="el-icon-plus"></i>
                        </el-upload>
                      </div>
                    </group>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="weui_cells weui_cells_form" style="margin-top: 0px; display: none;">
            <div class="weui_cell">
              <div class="weui_cell_bd weui_cell_primary">
                <div class="weui_uploader">
                  <div class="weui_uploader_hd weui_cell">
                    <div class="weui_cell_bd weui_cell_primary">录音上传<span class="red">（1M以内）</span></div>
                    <div class="weui_cell_ft"></div>
                  </div>
                  <div class="weui_uploader_bd" style="margin-top: 10px;">
                    <group class="baby-group" name="grouptape">
                      <div v-for="(item, index) in upfilestape" style="width: 100%;">
                        <div class="yn-update-demo">
                          <div class="yn-update-demo-img"><img src="./images/wxbj_scly.png"/>
                          </div>
                          <div class="yn-update-demo-mask">
                            <img src="../../assets/amplification.png"/>
                          </div>
                        </div>
                        <el-upload
                          :action="posturl+'?guid='+item.fileGuid+'&idx='+index"
                          list-type="picture-cardtape"
                          :on-success="handleSucesstape"
                          :on-preview="handlePictureCardPreviewtape"
                          :before-upload="beforeUploadtape"
                          :on-remove="onRemovetape"
                          :on-change="changeFiletape"
                          :file-list="filelist.tapefileList[0]"
                          accept="audio/*"
                          class="yn-update">
                          <i class="el-icon-plus"></i>
                        </el-upload>
                      </div>
                    </group>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="weui_cells weui_cells_form" style="margin-top: 0px;">
            <div class="weui_cell">
              <div class="weui_cell_bd weui_cell_primary">
                <div class="weui_uploader">
                  <div class="weui_uploader_hd weui_cell">
                    <div class="weui_cell_bd weui_cell_primary">视频上传<span class="red">（20M以内）</span></div>
                    <div class="weui_cell_ft"></div>
                  </div>
                  <div class="weui_uploader_bd" style="margin-top: 10px;">
                    <group class="baby-group" name="groupvideo">
                      <div v-for="(item, index) in upfilesvideo" style="width: 100%;">
                        <div class="yn-update-demo">
                          <div class="yn-update-demo-img"><img src="./images/wxbj_scsp.png"/></div>
                          <div class="yn-update-demo-mask">
                            <img src="../../assets/amplification.png"/>
                          </div>
                        </div>
                        <el-upload
                          :action="posturl+'?guid='+item.fileGuid+'&idx='+index"
                          list-type="picture-card"
                          :on-success="handleSucessvideo"
                          :on-preview="handlePictureCardPreviewvideo"
                          :before-upload="beforeUploadvideo"
                          :on-remove="onRemovevideo"
                          :on-change="changeFilevideo"
                          :file-list="filelist.videofilelist[0]"
                          accept="video/*"
                          class="yn-update">
                          <i class="el-icon-plus"></i>
                        </el-upload>
                      </div>
                    </group>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="ui-btn-wrap">
        <button class="ui-btn-lg ui-btn-primary" @click="SaveInfo">
          提交
        </button>
      </div>
      <div v-transfer-dom style="position:relative; z-index: 8000">
        <alert v-model="alertShow" title="提示" @on-hide="onHide"> {{ alertMessage }}</alert>
      </div>
      <div v-transfer-dom>
        <x-dialog v-model="dialogVisible" class="dialog-demo" hide-on-blur="true">
          <div class="img-box">
            <img :src="dialogImageUrl" style="max-width:100%">
          </div>
          <div @click="dialogVisible = false">
            <span class="vux-close"></span>
          </div>
        </x-dialog>
      </div>
      <!--弹出框一-->
      <div class="lysc_pup" id="lysc_pup1">
        <div class="lysc_pup_top">开始录音</div>
        <div class="lysc_pup_text">点击确定，开始录音。</div>
        <div class="lysc_pup_btn">
          <div class="btn_lf" id="btn_lf1">取消</div>
          <div class="btn_rt" id="btn_rt1">确认</div>
        </div>
      </div>
      <!--弹出框二-->
      <div class="lysc_pup" id="lysc_pup2">
        <div class="lysc_pup_top">录音中</div>
        <div class="lysc_pup_text">点击确定，录音结束。</div>
        <div class="lysc_pup_miao">55</div>
        <div class="lysc_pup_btn1" id="btn_lf2">
          确认
        </div>
      </div>
      <!--弹出框三-->
      <div class="lysc_pup" id="lysc_pup3">
        <div class="lysc_pup_top">录音完成</div>
        <div class="lysc_pup_text">确认要上传该录音？</div>
        <div class="lysc_pup_btn">
          <div class="btn_lf" id="btn_lf3">取消</div>
          <div class="btn_rt" id="btn_rt3">确认</div>
        </div>
      </div>
      <!--播放弹出框-->
      <div class="lysc_pup" id="lysc_pup4">
        <div class="lysc_pup_top">提示</div>
        <div class="lysc_pup_text" id="lysc_pup_text">播放或删除录音？</div>
        <div class="lysc_pup_btn">
          <div class="btn_lf" id="btn_lf4">删除</div>
          <div class="btn_rt" id="btn_rt4">播放</div>
        </div>
      </div>
      <!--遮罩-->
      <div id="zhezhao"></div>
    </section>
  </div>
</template>

<script>

  $("body").children().click(function () {

  });
  function addClick() {
    $('#cfile').addClass("needsclick");
  };
  import  './css/frozen.css'
  import  './css/weui.css'
  import  './css/main.css'
  import  './css/mobiscroll_002.css'
  import  './js/mobiscroll_002'
  import  './js/mobiscroll_004'
  import  './js/mobiscroll'
  import  './js/mobiscroll_003'
  import  './js/mobiscroll_005'
  import  './js/index'
  import  './js/qqdt/geolocation.min'
  import attach from './js/attach'
  import hz from './js/hz'
  import Guid from '../consult/js/guid'
  import {
    ConfirmPlugin,
    Tab,
    Alert,
    TabItem,
    Sticky,
    Divider,
    XButton,
    Swiper,
    SwiperItem,
    Datetime,
    Selector,
    Group,
    XInput,
    XSwitch,
    Flexbox,
    Calendar,
    FlexboxItem,
    XDialog,
    TransferDomDirective as TransferDom,
    dateFormat
  } from 'vux'
  export default {
    directives: {
      TransferDom
    },
    components: {
      Sticky,
      XDialog,
      Divider,
      XButton,
      Swiper,
      SwiperItem,
      Group,
      Selector,
      XInput,
      XSwitch,
      Flexbox,
      Alert,
      Datetime,
      FlexboxItem
    },
    data(){
      return {
        bjmaxlength: '200',//报警内容文字个数限制
        options: {timeout: 30000},
        geolocation: new qq.maps.Geolocation("JY3BZ-2JK3G-OV6QU-IWRF5-UE3X3-YIB5O", "myapp"),

        list1: [{key: 'km', value: '昆明'}],
        list1Value: '',
        list2: [{key: 'xsq', value: '西山区'}],
        list2Value: '',

        //腾讯地图返回参数
        qqmodel: {
          accuracy: '',
          lat: '',
          lng: '',
          city: '',
          district: '',
          adcode: '',
          nation: '',
          province: '',
          type: '',
          addr: ''
        },
        //表单信息
        tableinfo: {
          username1: '',
          userphone: '',
          usercode: '',
          istimeaddr: '',
          address: '',
          datenownew: dateFormat(new Date(), 'YYYY-MM-DD HH:mm:ss'),
          citynew: '',
          districtnew: '',
          addrnew: '',
          lngnew: '',
          latnew: '',
          isphone: '1',
          crcontent: '',
          toorgid: '',
          comno: '',
          inptaddr: '',
          inpt1addr: '',
          openid:''
        },
        //附件参数
        filelist: {
          picfileList: [],
          tapefileList: [],
          videofilelist: []
        },
        firstLoad: '0',
        posturl: global.storageApiUrl + '/storage/upload',
        upfilespic: [],
        upfilestape: [],
        upfilesvideo: [],
        matSubType: '01',
        matNum: 'hz-02',
        uploadfileDataspic: [],
        uploadfileDatastape: [],
        uploadfileDatasvideo: [],
        alertShow: false,
        alertMessage: '',
        dialogImageUrl: '',
        dialogVisible: false,
        toorgidnew:'',

        ALARMGuid: new Guid().newGUID(),

        ISSFtime1:true,
        ISSFtime2:false,

        //用户信息
        user_sfz: '',
        user_name: '',
        user_phone: '',
        user_Id: ''
      }
    },
    mounted(){
      this.istimeaddr1();
      //console.log('用户名称：' + this.user_name);

    },
    created(){
      this.initAttach();
      this.loadZsqh();
      this.getUserInfo();
      attach.initUrl(global.tskApiUrl);
      hz.initUrl(global.tskApiUrl);
    },
    watch: {
      '$route' (to, from) {
        this.fileList = [];
        for (let i = 0; i < 30; i++)
          this.fileList[i] = [];
        this.uploadfileDataspic = [];
        this.uploadfileDatastape = [];
        this.uploadfileDatasvideo = [];
      }
    },
    updatedpic(){
      let self = this;
      let run = '0'
      if (self.firstLoad == '0') {
        for (let h = 0; h < self.fileList.picfileList.length; h++) {
          for (let k = 0; k < self.fileList.picfileList[h].length; k++) {
            let fileItem = {
              findex: h,
              uid: self.fileList.picfileList[h][k].uid,
              guid: self.fileList.picfileList[h][k].guid,
              matMId: self.fileList.picfileList[h][k].matMId,
              fileSize: self.fileList.picfileList[h][k].fileSize,
              fileRealName: self.fileList.picfileList[h][k].name,
              url: self.fileList.picfileList[h][k].shorturl,
              isNew: '0'
            };
            self.uploadfileDataspic.push(fileItem);
            self.firstLoad = '1';
          }
        }
      }
    },
    updatedtape(){
      let self = this;
      let run = '0'
      if (self.firstLoad == '0') {
        for (let h = 0; h < self.fileList.tapefileList.length; h++) {
          for (let k = 0; k < self.fileList.tapefileList[h].length; k++) {
            let fileItem = {
              findex: h,
              uid: self.fileList.tapefileList[h][k].uid,
              guid: self.fileList.tapefileList[h][k].guid,
              matMId: self.fileList.tapefileList[h][k].matMId,
              fileSize: self.fileList.tapefileList[h][k].fileSize,
              fileRealName: self.fileList.tapefileList[h][k].name,
              url: self.fileList.tapefileList[h][k].shorturl,
              isNew: '0'
            };
            self.uploadfileDatastape.push(fileItem);
            self.firstLoad = '1';
          }
        }
      }
    },
    updatedvideo(){
      let self = this;
      let run = '0'
      if (self.firstLoad == '0') {
        for (let h = 0; h < self.fileList.videofilelist.length; h++) {
          for (let k = 0; k < self.fileList.videofilelist[h].length; k++) {
            let fileItem = {
              findex: h,
              uid: self.fileList.videofilelist[h][k].uid,
              guid: self.fileList.videofilelist[h][k].guid,
              matMId: self.fileList.videofilelist[h][k].matMId,
              fileSize: self.fileList.videofilelist[h][k].fileSize,
              fileRealName: self.fileList.videofilelist[h][k].name,
              url: self.fileList.videofilelist[h][k].shorturl,
              isNew: '0'
            };
            self.uploadfileDatasvideo.push(fileItem);
            self.firstLoad = '1';
          }
        }
      }
    },
    methods: {
      //第一次加载州市的数据
      loadZsqh() {
        let self = this;
        this.axios.get(global.tskApiUrl + "/tasks/hz/org/0?parentcode=").then(function (response) {
          var data = response.data.data;
          console.log(data.length);
          self.list1 = [];
          var arrDept = [];
          for (var i = 0; i < data.length; i++) {
              var objdept = {
                "key": data[i].guid,
                "value": data[i].orgName
              }
              arrDept.push(objdept);
          }
          self.list1 = arrDept;

          if (self.$route.params.guid)
            self.loadForm(self, self.$route.params.guid);
        })
      },
      //选择州市的事件
      onChangeZsqh(){
        if (this.list1Value != "") {
          //获取该州市下的区县
          let self = this;
          this.axios.get(global.tskApiUrl + "/tasks/hz/org/1?parentcode=" + self.list1Value).then(function (response) {
            var data = response.data.data;
            self.list2 = [];
            var arrDept = [];

            for (var i = 0; i < data.length; i++) {
              var objdept = {
                "key": data[i].guid,
                "value": data[i].orgName
              }
              arrDept.push(objdept);
            }
            self.list2 = arrDept;
            self.list2Value = self.tempList2Value;
          })
        }
      },
      loadForm: function (self, guid) {
        hz.initForm(self, self.hzTable, guid).then(function (res) {
          console.log(res);
          self.name = res.data.data.blr_xm;
          self.sfz = res.data.data.blr_sfz;
          if (res.data.data.is_zx == '1')
            self.iszxqs = true;
          else
            self.iszxqs = false;
          self.list1Value = res.data.data.zsqh;
          self.tempList2Value = res.data.data.hjdz_ssxqdm;
          self.tempList3Value = res.data.data.sqd_gajgdwdm;
          //ßconsole.log(res);
        });
      },
      //获取用户信息
      getUserInfo(){
        let self = this;
        let user = JSON.parse(localStorage.getItem('user'));
        if (user == null) {
          this.$router.push('../../login');
        }
        else {
        }
        self.axios.get(global.memberApiUrl + "/member/" + user.guid).then(function (response) {
          self.tableinfo.usercode = response.data.data.idNum;
          self.tableinfo.username1 = response.data.data.realName;
          self.tableinfo.userphone = response.data.data.acountId;
          self.tableinfo.openid = localStorage.getItem('openId');
          //self.user_Id = response.data.data.acountId;
        }).catch(function (response) {
          console.log('报错信息：' + response);
          this.$router.push('../../login');
        });
      },
      initAttach: function () {
        console.log('开始页面加载');
        let self = this;
        let list = [{
          guid: 'bj-mat-001',
          matNum: 'hz-05',
          matAttType: '01',
          fileGuid: 'pic00001',
          fileName: '图片信息',
          filCode: '',
          isNeed: 'Y'
        }];
        let listvideo = [{
          guid: 'bj-mat-003',
          matNum: 'hz-06',
          matAttType: '01',
          fileGuid: 'video00001',
          fileName: '视频信息',
          filCode: '',
          isNeed: 'Y'
        }];
        let listtape = [{
          guid: 'bj-mat-002',
          matNum: 'hz-07',
          matAttType: '01',
          fileGuid: 'tape00001',
          fileName: '录音信息',
          filCode: '',
          isNeed: 'Y'
        }];
        self.upfilespic = list;
        self.upfilestape = listtape;
        self.upfilesvideo = listvideo;
      },
      loadFiles: function (self, guid, upfiles) {
        attach.initTskFiles(self, guid).then(function (res) {
          let files = res.data.data;
          for (let i = 0; i < upfiles.length; i++) {
            let fileGuid = upfiles[i].fileGuid;
            for (let j = 0; j < files.length; j++) {
              if (files[j].tsk_m_id == fileGuid) {
                self.fileList[i].push({
                  name: files[j].realfilename,
                  url: global.stroageUrl + files[j].filename,
                  guid: files[j].guid,
                  matMId: files[j].tsk_m_id,
                  fileSize: files[j].contentsize,
                  shorturl: files[j].filename
                });
              }
            }
          }
          self.fileList.picfilelist.upfiles = upfiles;
        });
      },

      //图片上传
      handleSucess: function (response, file, fileList) {
        console.log(response);
        if (response.succ != true) {
          this.alertShow = true;
          this.alertMessage = "上传失败！";
          this.$refs.fs[this.findex].uploadFiles.pop();
          return;
        }
        console.log(response);
        let fileItem = {
          findex: this.findex,
          uid: file.uid,
          guid: response.data.guid,
          matMId: response.data.userDefined.guid[0],
          fileSize: response.data.size,
          fileRealName: response.data.name,
          url: response.data.url,
          isNew: '1'
        };
        this.uploadfileDataspic.push(fileItem);
      },
      handlePictureCardPreview(file) {
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
      },
      beforeUpload: function (file) {
        let size = file.size / 1024;
        let ext = file.name.substring(file.name.lastIndexOf(".") + 1).toLocaleLowerCase();
        if (size > 1024 * 5 || size < 5) {
          //this.$refs.fs[this.findex].uploadFiles.pop();
          this.alertShow = true;
          this.alertMessage = "附件大小超出范围！";
          return false;
        }
        return true;
      },
      onRemove: function (file, fileList) {
        if (!file)
          return;
        let uid = file.uid;
        let itemIndex = -1;
        let findex = 0;
        for (let item in this.uploadfileDataspic) {
          if (this.uploadfileDataspic[item].uid == uid) {
            itemIndex = item;
            findex = this.uploadfileDataspic[item].findex;
            break;
          }
        }
        if (itemIndex != -1) {
          let delUrl = global.storageApiUrl + '/storage/del?file_url=' + this.uploadfileDataspic[itemIndex].url;
          this.axios.post(delUrl)
            .then(function (response) {
            })
            .catch(function (response) {
            });
          this.uploadfileDataspic.splice(itemIndex, 1);
          console.log(this.uploadfileDataspic);
        }
      },
      changeFile: function (file, fileList) {
      },

      //录音上传
      handleSucesstape: function (response, file, fileList) {
        console.log(response);
        if (response.succ != true) {
          this.alertShow = true;
          this.alertMessage = "上传失败！";
          this.$refs.fs[this.findex].uploadFiles.pop();
          return;
        }
        console.log(response);
        let fileItem = {
          findex: this.findex,
          uid: file.uid,
          guid: response.data.guid,
          matMId: response.data.userDefined.guid[0],
          fileSize: response.data.size,
          fileRealName: response.data.name,
          url: response.data.url,
          isNew: '1'
        };
        this.uploadfileDatastape.push(fileItem);
      },
      handlePictureCardPreviewtape(file) {
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
      },
      beforeUploadtape: function (file) {
        let size = file.size / 1024;
        let ext = file.name.substring(file.name.lastIndexOf(".") + 1).toLocaleLowerCase();
        if (size > 1024 * 5 || size < 5) {
          //this.$refs.fs[this.findex].uploadFiles.pop();
          this.alertShow = true;
          this.alertMessage = "附件大小超出范围！";
          return false;
        }
        return true;
      },
      onRemovetape: function (file, fileList) {
        if (!file)
          return;
        let uid = file.uid;
        let itemIndex = -1;
        let findex = 0;
        for (let item in this.uploadfileDatastape) {
          if (this.uploadfileDatastape[item].uid == uid) {
            itemIndex = item;
            findex = this.uploadfileDatastape[item].findex;
            break;
          }
        }
        if (itemIndex != -1) {
          let delUrl = global.storageApiUrl + '/storage/del?file_url=' + this.uploadfileDatastape[itemIndex].url;
          this.axios.post(delUrl)
            .then(function (response) {
            })
            .catch(function (response) {
            });
          this.uploadfileDatastape.splice(itemIndex, 1);
          console.log(this.uploadfileDatastape);
        }
      },
      changeFiletape: function (file, fileList) {
      },

      //视频上传
      handleSucessvideo: function (response, file, fileList) {
        if (response.succ != true) {
          this.alertShow = true;
          this.alertMessage = "上传失败！";
          this.$refs.fs[this.findex].uploadFiles.pop();
          return;
        }
        let fileItem = {
          findex: this.findex,
          uid: file.uid,
          guid: response.data.guid,
          matMId: response.data.userDefined.guid[0],
          fileSize: response.data.size,
          fileRealName: response.data.name,
          url: response.data.url,
          isNew: '1'
        };
        this.uploadfileDatasvideo.push(fileItem);
      },
      handlePictureCardPreviewvideo(file) {
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
      },
      beforeUploadvideo: function (file) {
        let size = file.size / 1024;
        let ext = file.name.substring(file.name.lastIndexOf(".") + 1).toLocaleLowerCase();
        if (size > 1024 * 5 || size < 5) {
          //this.$refs.fs[this.findex].uploadFiles.pop();
          this.alertShow = true;
          this.alertMessage = "附件大小超出范围！";
          return false;
        }
        return true;
      },
      onRemovevideo: function (file, fileList) {
        if (!file)
          return;
        let uid = file.uid;
        let itemIndex = -1;
        let findex = 0;
        for (let item in this.uploadfileDatasvideo) {
          if (this.uploadfileDatasvideo[item].uid == uid) {
            itemIndex = item;
            findex = this.uploadfileDatasvideo[item].findex;
            break;
          }
        }
        if (itemIndex != -1) {
          let delUrl = global.storageApiUrl + '/storage/del?file_url=' + this.uploadfileDatasvideo[itemIndex].url;
          this.axios.post(delUrl)
            .then(function (response) {
            })
            .catch(function (response) {
            });
          this.uploadfileDatasvideo.splice(itemIndex, 1);
          console.log(this.uploadfileDatasvideo);
        }
      },
      changeFilevideo: function (file, fileList) {
      },

      //提交信息
      SaveInfo() {
        //console.log("是否：" + this.tableinfo.crcontent);
        let self = this;
        let apiurl = global.apphubApiUrl;
        //验证信息
        var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
        if (this.tableinfo.username1 == "") {
          this.alertShow = true;
          this.alertMessage = "请输入姓名";
          return false;
        } else if (this.tableinfo.userphone == "") {
          this.alertShow = true;
          this.alertMessage = "请输入手机号码";
          return false;
        } else if (this.tableinfo.usercode == "") {
          this.alertShow = true;
          this.alertMessage = "请输入身份证号";
          return false;
        }else if (this.tableinfo.crcontent == "") {
          console.log("定位为空："+this.tableinfo.crcontent);
          this.alertShow = true;
          this.alertMessage = "请输入报警内容";
          return false;
        }
//        else if (!reg.test(this.tableinfo.usercode.trim())) {
//          this.alertShow = true;
//          this.alertMessage = "您的身份证号格式不正确";
//          return false;
//        }
        else if (this.tableinfo.istimeaddr == "0") {
          if (this.list1Value == undefined) {
            this.alertShow = true;
            this.alertMessage = "请选项州市";
            return false;
          } else if (this.list2Value == undefined) {
            this.alertShow = true;
            this.alertMessage = "请选项区县";
            return false;
          } else if (this.tableinfo.inptaddr == "") {
            this.alertShow = true;
            this.alertMessage = "请输入事发地点";
            return false;
          }
        } else if (this.tableinfo.istimeaddr == "1") {
          //精准定位
          this.geolocation.getLocation(this.showPosition, this.showErr, this.options);
        }else if (this.toorgidnew == "") {
          this.alertShow = true;
          this.alertMessage = "定位中，请稍等";
          return false;
        }
        console.log("定位内容："+this.tableinfo.crcontent);
        //获取行政区号-通过市和区获取
        //console.log("定位城市："+this.tableinfo.citynew);
        //console.log("定位区县："+this.tableinfo.districtnew );
        //console.log(self.tableinfo.toorgid);
        //return false;
        //self.tableinfo.toorgid='';
        //console.log(this.tableinfo.crcontent);
        //return false;

        this.axios({
          method: 'get',
          url: apiurl + '/apphub/getInstance/?deptNo=' + self.toorgidnew
        }).then(function (response) {
            if (response.data.code = 200) {
              self.tableinfo.comno = response.data.code.msg;
            }
            else {
              self.tableinfo.comno = '';
            }
          }
        );
        //console.log("toorgidnew："+self.toorgidnew);
        self.tableinfo.toorgid=self.toorgidnew;
        //console.log("comno:" + self.tableinfo.comno);
        if (self.tableinfo.istimeaddr == '0') {
          this.tableinfo.address =  this.tableinfo.inptaddr;//this.list2Value +
          this.tableinfo.toorgid=this.list2Value+'000000';
        }
        //console.log("区县的新政代码："+self.tableinfo.toorgid);
        //return false;
        let data1 = {
          GUID: self.ALARMGuid,
          ADDRESS: self.tableinfo.address,
          CRCONTENT: self.tableinfo.crcontent,
          ISPHONE: self.tableinfo.isphone,
          USERCODE: self.tableinfo.usercode,
          USERNAME: self.tableinfo.username1,
          USERPHONE: self.tableinfo.userphone,
          USERADDRESS: '',
          UNITCONTACTOR: '',
          HANDPHONE: '',
          TOORGID: self.tableinfo.toorgid,
          TOORGNAME: self.tableinfo.citynew+self.tableinfo.districtnew,
          COMNO: self.tableinfo.comno,
          OPENID: self.tableinfo.openid,
          EARTH_LONG: self.tableinfo.lngnew,
          EARTH_LAT: self.tableinfo.latnew,
          STATE: 0,
          ALAMSTATE: 0
        };
//        this.$vux.loading.show({
//          text: '提交中'
//        })
        //console.log('提交接口地址为：'+apiurl + "/apphub/insert-callpolice");
        this.axios({
          method: 'post',
          url: apiurl + "/apphub/insert-callpolice",
          data: data1
        }).then(function (response) {
            if (response.data.code == 200) {
              //添加提示
              self.alertShow = true;
//              self.alertMessage = "您所报的警情公安机关已收到";
              self.alertMessage ="已提交";
            }
            else {
              self.alertShow = true;
              self.alertMessage = "数据提交异常，请重新尝试";
              return false;
              //alert('保存失败！');
            }
            console.log(response);
          }
        );
        //图片上传
        if (self.uploadfileDataspic.length > 0) {
          for (var i = 0; i < self.uploadfileDataspic.length; i++) {
            let data1 = {
              GUID: self.uploadfileDataspic[i].guid,
              NAME: self.uploadfileDataspic[i].fileRealName,
              SIZE: self.uploadfileDataspic[i].fileSize,
              TIME: self.uploadfileDataspic[i].matMId,
              URL: self.uploadfileDataspic[i].url,
              MIME: '',
              ALARMGUID: self.ALARMGuid,
              MD5: self.uploadfileDataspic[i].uid
            };
            //console.log(data1);
            this.axios({
              method: 'post',
              url: apiurl + "/apphub/insert-callpolicematil",
              data: data1
            }).then(function (response) {

            })
          }
        };
        //视频上传
        if (this.uploadfileDatasvideo.length > 0) {
          for (var i = 0; i < self.uploadfileDatasvideo.length; i++) {
            let data1 = {
              GUID: self.uploadfileDatasvideo[i].guid,
              NAME: self.uploadfileDatasvideo[i].fileRealName,
              SIZE: self.uploadfileDatasvideo[i].fileSize,
              TIME: self.uploadfileDatasvideo[i].matMId,
              URL: self.uploadfileDatasvideo[i].url,
              MIME: '',
              ALARMGUID: self.ALARMGuid,
              MD5: self.uploadfileDatasvideo[i].uid
            };
            //console.log(data1);
            this.axios({
              method: 'post',
              url: apiurl + "/apphub/insert-callpolicematil",
              data: data1
            }).then(function (response) {

            })
          }
        }
      },
      onHide: function () {
        if (this.alertMessage == "保存成功") {
          this.alertShow = true;
          this.alertMessage = "保存成功";
          this.$router.replace({path: '/'});
          //self.$router.push('/');
        }else if (this.alertMessage == "已提交") {
          this.alertShow = true;
          this.alertMessage = "已提交";
          this.$router.replace({path: '/'});
          //self.$router.push('/');
        }else if (this.alertMessage == "申报成功") {
          this.alertShow = true;
          this.alertMessage = "申报成功";
          this.$router.replace({path: '/'});
          //self.$router.push('/');
        }
      },
      //<--页面控制方法Start-->
      //是否当前时间及地点-是
      istimeaddr1()
      {
        console.log("是当前时间及地点");
        $("#tureIStime").hide();
        $("#falseIStime").show();
        this.tableinfo.istimeaddr = '1';
        //精准定位
        this.geolocation.getLocation(this.showPosition, this.showErr, this.options);
        //console.log(this.tableinfo.address);
        this.ISSFtime2=false;
        this.ISSFtime1=true;
        this.tableinfo.datenownew= dateFormat(new Date(), 'YYYY-MM-DD HH:mm:ss');
      },
      //是否当前时间及地点-否
      istimeaddr2()
      {
        console.log("否当前时间及地点");
        $("#tureIStime").show();
        $("#falseIStime").hide();
        this.tableinfo.istimeaddr = '0';
        this.tableinfo.citynew = "云南省";
        this.tableinfo.districtnew = "昆明市";
        this.tableinfo.address = this.list2Value + this.tableinfo.inptaddr;
        this.tableinfo.lngnew = '';
        this.tableinfo.latnew = '';
        this.ISSFtime2=true;
        this.ISSFtime1=false;
        console.log(this.tableinfo.address);
      },
      isphoneclick0()
      {
        console.log("否接电话");
        this.tableinfo.isphone = '0';
      },
      isphoneclick1()
      {
        console.log("是接电话");
        this.tableinfo.isphone = '1';
      },
      //<--页面控制方法END-->

      //<--定位方法Start-->
      showPosition(position) {
          let self=this;
        //$("#dz_inpt1").val(position.addr);
        this.tableinfo.inpt1addr = position.addr;
        this.qqmodel = position;
        this.tableinfo.citynew = this.qqmodel.city;
        this.tableinfo.districtnew = this.qqmodel.district;
        this.tableinfo.lngnew = this.qqmodel.lng;
        this.tableinfo.latnew = this.qqmodel.lat;
        this.tableinfo.address = this.qqmodel.city + this.qqmodel.district + this.qqmodel.addr;
        this.axios({
          method: 'get',
          url: global.baseApiUrl + '/base/region_toogid/' + this.tableinfo.citynew+'/'+this.tableinfo.districtnew
        }).then(function (response) {
            console.log(  response.data );
            if (response.data.succ = true) {
              self.toorgidnew = response.data.data;
              console.log(  response.data.data );
            }
            else {
              //如果获取不到定位信息，则默认昆明市公安局指挥中心
              self.toorgidnew = '530100000000';
            }
          }
        );
      },
      showErr() {
        $("#dz_inpt1").val("定位失败！");
      },
      showWatchPosition(){
        console.log("监听开始");
        this.geolocation.watchPosition(showPosition);
      },
      showClearWatch() {
        console.log("监听结束");
        this.geolocation.clearWatch();
      }
      //<--定位方法END-->
    }
  }
</script>
<style>
  .purchase_house .vux-no-group-title {
    margin-top: 0
  }

  .star .weui-label:before {
    content: '*';
    padding-right: 5px;
    color: #ff0000
  }

  .yn-update-demo {
    width: 80px;
    height: 80px;
    float: left;
    border: 1px dashed #c0ccda;
    border-radius: 6px;
    box-sizing: border-box;
    overflow: hidden;
    margin-top: 10px;
    margin-left: 10px;
    position: relative;
  }

  .yn-update-demo .yn-update-demo-img img {
    width: 80px;
    height: 80px
  }

  .yn-update-demo-mask {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.5);
    text-align: center
  }

  .yn-update-demo-mask img {
    width: 24px;
    height: 24px;
    margin-top: 28px
  }

  .yn-update-demo:hover {
    border-color: #20a0ff;
  }

  .yn-update-demo:hover .yn-update-demo-mask {
    display: block
  }

  .yn-update {
    float: left;
    margin-left: 10px;
    margin-top: 10px
  }

  .yn-update .el-upload-list--picture-card .el-upload-list__item {
    width: 80px;
    height: 80px
  }

  .yn-update .el-upload-list--picture-card .el-upload-list__item-status-label i {
    margin-top: 12px
  }

  .yn-update .el-upload--picture-card {
    width: 80px;
    height: 80px;
    line-height: 85px;
  }
</style>
<style lang="less" scoped>
  h3 {
    font-size: 18px;
    padding: 5px;
    border-bottom: 1px solid #D9D9D9;
    margin-bottom: 15px;
  }

  p {
    line-height: 24px;
    margin-bottom: 5px;
  }

  .ui-form-item {
    padding-left: 20px;
  }

  textarea {
    resize: none;
  }

  .ui-form-item-show label {
    color: #000;
  }

  .ui-form-item input {
    color: #333;
  }

  .ui-form-item-textarea textarea {
    margin-top: 11px;
  }

  /*上传附件*/
  .weui_uploader_bd {
    overflow: inherit;
  }

  .weui_uploader_file {
    position: relative;
  }

  .weui_cells:before {
    border-top: 0px;
  }

  .red {
    color: #F80000;
    font-size: 14px;
  }
</style>
